$(function() {
	
	// $(".list button").click()
	$(".list button").on("click", function() {
		const wd = $(this).prev().val()
		if(!wd) {
			return
		}
		
		
		// http://localhost:3000/search?keywords=${wd}
		const p = new Promise((resolve, reject) => {
			$.ajax({
				url: `http://localhost:3000/search?keywords=${wd}`,
				success(res) {
					resolve(res)
				},
				error(e) {
					reject(e)
				}
			})	
		})
		
		
		
		p.then(({ result }) => {
			const { songs } = result
			const listHtml = songs.map(({ name, id }) => `<li data-id="${id}">${name}</li>`)
			$(".list ol").append(listHtml.join(""))
		}).catch((e) => {
			console.log(e)
		}).finally(() => {
			
		})
		
	})
	
	
	const getComments = (id) => {
		return new Promise((resolve, reject) => {
			$.ajax({
				url: `http://localhost:3000/comment/music?id=${id}`,
				success(res) {
					resolve(res)
				},
				error(e) {
					reject(e)
				}
			})	
		})
	}
	
	// http://localhost:3000/comment/music?id=186016&limit=1
	$(".list").on("click", "li", function() {
		// console.log($(this).attr("data-id"))
		// console.log($(this).data("id"))
		const id = $(this).data("id")
		getComments(id).then((res) => {
			console.log(res.comments)
			console.log(res.hotComments)
			const commentList = [...res.comments, ...res.hotComments]
			$(".comments ul").html("")
			commentList.forEach((item) => {
				// console.log(item)
				$(".comments ul").append(`<li>${item.content}</li>`)
			})
		})
	})
})





